<!--@ 首页 -->
<template>
	<view class="bg-white" v-if="dataFrom && dataFrom.workDetails">
		<u-notify ref="uNotify" />

		<view class="cu-bar bg-white  margin-top-xs" v-if="dataFrom.workDetails && dataFrom.workDetails.length">
			<view class="action">
				<text class="cuIcon-title text-cyan"></text>
				<text class="text-df text-cyan text-bold">{{`${dataFrom.order.projectSubtitle}`}}
					<text class="text-red text-df text-bold padding-left-xs">
						{{`( ${ dataFrom.workDetails.length} )`}}
					</text>
				</text>
			</view>
			<view class="action">
				<view class="cu-btn sm bg-cyan" @click="handeNew()">添加</view>
			</view>
		</view>
		<uni-table ref="table" v-if="dataFrom.workDetails && dataFrom.workDetails.length >0" :loading="loading" border
			emptyText="暂无更多数据" uni-table @selection-change="selectionChange" style="height: 1400rpx;overflow-y: auto;">
			<uni-tr>
				<uni-th width="42" align="center">
					<view class="text-xs">序号</view>
				</uni-th>
				<uni-th width="120" align="center">
					<view class="text-xs">归属</view>
				</uni-th>
				<uni-th align="center" width="75">
					<view class="text-xs">开始时间</view>
				</uni-th>
				<uni-th width="260" align="center">
					<view class="text-xs">BUG|功能改进</view>
				</uni-th>

				<uni-th align="center" width="75">
					<view class="text-xs">结束时间</view>
				</uni-th>
				<!-- 				<uni-th align="center">
					<view class="text-xs">截止时间</view>
				</uni-th> -->
				<uni-th align="center" width="43">
					<view class="text-xs">进度</view>
				</uni-th>
				<!-- 				<uni-th align="center">
					<view class="text-xs">状态</view>
				</uni-th> -->
				<uni-th width="45" align="center">
					<view class="text-xs">负责</view>
				</uni-th>
				<!-- 	<uni-th width="100" align="center">
					<view class="text-xs">备注</view>
				</uni-th> -->
				<uni-th width="100" align="center">
					<view class="text-xs">图片</view>
				</uni-th>
				<uni-th width="150" align="center">
					<view class="text-xs">操作</view>
				</uni-th>
			</uni-tr>
			<uni-tr v-for="(item, index) in dataFrom.workDetails" :key="index"
				v-if="dataFrom.workDetails && dataFrom.workDetails.length>0"
				:class="item.state ==1 || item.selfOk ==1?'box' :''">
				<uni-td align="center">
					<view class="cu-avatar sm round  bg-cyan"
						>{{dataFrom.workDetails.length - index}}
					</view>
				</uni-td>
				<uni-td align="center">
					<view class="text-xs">{{ item.belongingTo }}</view>
				</uni-td>
				<uni-td align="center">
					<view class="text-xs">{{ item.orderStartDate }}</view>
				</uni-td>
				<uni-td align="center">
					<view class="text-xs">{{ item.projectTitle }}</view>
				</uni-td>
				<uni-td align="center">
					<view class="text-xs">{{ item.orderEndDate }}</view>
				</uni-td>
				<!-- 				<uni-td align="center">
					<view class="text-xs">{{ item.orderEndDate }}</view>
				</uni-td> -->
				<uni-td align="center">
					<view class="text-xs">{{ item.speedOfProgress }}</view>
				</uni-td>
				<!-- 				<uni-td align="center">
					<view class="text-xs">{{ item.state }}</view>
				</uni-td> -->

				<uni-td align="center">
					<view class="text-xs">{{ item.username }}</view>
				</uni-td>
				<uni-td align="center">
					<view class="cu-avatar-group" v-if="item.picPath">
						<view class="cu-avatar round" @click="handeImage(index2,item.picPath)"
							v-for="(item2,index2) in handItyCard(item.picPath)" :key="index2"
							:style="[{ backgroundImage:'url(' + item2 + ')' }]"></view>

					</view>
					<view v-else>无图片</view>
				</uni-td>


				<!-- 	<uni-td align="center">
					<view class="text-xs">{{ item.remark }}</view>
				</uni-td> -->
				<uni-td align="center">
					<view>
						<view class="flex justify-around align-center">
							<view class="cu-btn sm round bg-green" @click="handeCompleted(item)"
								v-if="ShowAdmin && item.state ==0">完结</view>
							<view class="cu-btn sm round bg-yellow" v-if="item.selfOk !=1" @click="handeRemack(item)">更新
							</view>
							<view class="cu-btn sm round bg-green" v-if="item.selfOk !=1" @click="handeComplete(item)">
								自我确认</view>
							<view class="text-blue" v-if="item.selfOk ==1">
								{{item.selfOkDate}}
							</view>
						</view>
						<!--  -->
					</view>
				</uni-td>

			</uni-tr>
		</uni-table>
		<remarkMode ref="remarkFrom" @ok="loadData" />
		<NewMode ref="Newref" @ok="loadData" />
	</view>
</template>
<script>
	import loadFlex from '@/components/loadFlex/loadFlex.vue' //加载框
	import remarkMode from '@/components/remarkMode.vue' //备注
	import NewMode from '@/components/NewMode.vue' //新增
	import myApi from '@/utils/app.js' //调用接口使
	export default {
		name: 'manufacture',
		components: {
			loadFlex,
			remarkMode,
			NewMode,
		},
		props: {
			ShowAdmin: {
				type: Boolean,
				default: false
			},
			dataFrom: {
				type: Object,
				default: () => {}
			}
		},
		data() {
			return {
				loading: false,
				searchVal: '',
				tableData: [],
				// 每页数据量
				pageSize: 10,
				// 当前页
				pageCurrent: 1,
				// 数据总量
				total: 0,
				model: {},
			}
		},
		computed: {
			handItyCard() {
				return function(text) {
					if (text) return text.split(",")
					return []
				}
			},
		},
		methods: {
			async loadData(index) {
				this.$emit('ok', 1)
			},
			handeRemack(item) {
				this.$refs.remarkFrom.OnPortuni(item)
			},
			handeComplete(item) {
				let that = this
				uni.showModal({
					title: '提示',
					content: '确认自我确定吗？',
					success: function(res) {
						if (res.confirm) that.handeNoApply(item)
					},
				})
			},
			onNotify(round) {
				this.$refs.uNotify.show({
					type: round.type ? round.type : 'success',
					message: round.message ? round.message : '删除成功',
					top: 50
				})
			},
			async handeNoApply(item) {
				this.loading == true
				try {
					const res = await this.$request({
						url: myApi.selfOk,
						method: 'post',
						data: {
							orderNo: item.orderId,
							vto: {
								id: item.id
							}
						},
					});
					console.log(res)
					if (res.code == 200) {
						this.$emit('ok', 1)
						setTimeout(() => (
							this.onNotify({
								message: '操作成功'
							})), 1000);
					}
				} catch (e) {
					// 失败执行

				} finally {
					// 销毁执行
					this.loading = false
				}
			},
			handeImage(index, item) {
				console.log(item)
				const imgs = item.split(",").map(item => {
					//只返回图片路径
					return item
				})
				console.log(imgs);
				//调用预览图片的方法
				uni.previewImage({
					urls: imgs,
					current: index
				})

			},
			handeNew() {
				this.$refs.Newref.onNew(this.dataFrom.workDetails[0])
			},
			handeCompleted(item) { // 完结
				const that = this
				uni.showModal({
					title: '提示',
					content: '确定要完结吗？',
					success: function(res) {
						if (res.confirm) that.onCompleted(item)
					},
				})
			},
			async onCompleted(item) {
				console.log(item)
				this.loading = true
				try {
					const res = await this.$request({
						url: myApi.bmsProjectGressOrderOver,
						method: 'post',
						data: {
							orderNo: item.orderId,
							vto: {
								id: item.id
							}
						},
					});
					console.log(res)
					if (res.code == 200) {
						this.$emit('ok', 1)
						setTimeout(() => (
							this.onNotify({
								message: '操作成功'
							})), 1000);
					}
				} catch (e) {
					// 失败执行

				} finally {
					// 销毁执行
					this.loading = false
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.box {
		background-color: #CBEDED;
	}
</style>